//控制页面大小函数

const controller = new Vue({
    el:"#controller",
    data(){
        return{
            mediaSizeMax:300,   //最大
            mediaSizeMin:10,    //最小
            mediaSize:{data:300},
        }
    },
    methods:{
        //插入到数据里面
        data_setMediaSize:function(mediaSize)
        {
            this.mediaSize = mediaSize;
        },
        data_getMediaSize:function()
        {
            return this.mediaSize;
        },



        //事件dom的放大操作
        on_magnify:function()
        {
            let size = this.mediaSize.data + 30;

            if(size <= this.mediaSizeMax)
            {
                anime({
                    targets:this.mediaSize,
                    data:size,
                    duration:400,
                    easing:"easeInOutQuart",
                    update:function(e){
                        // this.mediaSize.data  = mediaSize;
                    }
                });

                
            }
           
        },
        //事件dom的缩小操作
        on_reduce:function()
        {
            let size = this.mediaSize.data - 30;

            if(size >= this.mediaSizeMin)
            {
                anime({
                    targets:this.mediaSize,
                    data:size,
                    duration:400,
                    easing:"easeInOutQuart",
                    update:function(e){

                    }
                });
            }
        },
        //事件的归位操作
        on_original:function()
        {
            anime({
                targets:this.mediaSize,
                data:100,
                duration:400,
                easing:"easeInOutQuart",
                update:function(e){
                }
            });

            //将主页中的位置中间的归位
            anime({
                targets:main.requestData.canvasThisPosition,
                x:0,
                y:0,
                duration:400,
                easing:"easeInOutQuart",
                update:function(e){
                }
            });




        },

    },
    created()
    {
        //将当前的内容赋予到页面
        // setTimeout(()=>{

        //     this.data_setMediaSize(
        //         main.requestData.mediaSize.data
        //     );
        //     main.requestData.mediaSize = this.mediaSize;
        // },1000);
        
        

    }
});




var controllerS = document.getElementById("controller");



//动画初始化
function controller_init(){
    //执行动画内容
    controllerS.style.transform = "translateX(80px)";
}



controller_init();




//动画执行
function controller_exit(){
    
    setTimeout(()=>{


        //执行动画内容
        anime({
            targets:controllerS,
            duration:700,
            // delay:1000,
            translateX: 0,
            update:function(){
            }
        });



    },Math.round(Math.random()*600));


}

setTimeout(controller_exit,000);
